import {
  // BrowserRouter as Router,
  //为了能在非组件文件中使用history进行路由的跳转这里就不能使用BrowserRouter或者HashRouter
  /**
   * 这两种模式是包含了history的模块的，除了BrowserRouter和HashRouter这两种模式的路由
   * 还有另外一个路由组件Router但是不包含history模块，需要手动引入history模块
   */
  Router,
  Route,
} from "react-router-dom"
//导入history对象
import history from "./utils/history"
import Login from "./pages/Login"
import GeekLayout from "./pages/Layout"
import Counter from "./pages/Count"
import { Redirect } from "react-router-dom"
import { AuthRoute } from "@/compontes/AuthRoute"

function App() {
  return (
    // 传递给Router 的 history
    <Router history={history}>
      <div className="App">
        <Route exact path="/" render={() => <Redirect to="/home" />}></Route>
        {/* <Route path='/home' component={Layout}></Route>  */}
        {/* 一级路由做了权限控制，那么二级路由也就无法进入,会显示空白 */}
        <AuthRoute path="/home" component={GeekLayout}></AuthRoute>
        {/* <AuthRoute path="/home" component={GeekLayout}></AuthRoute> */}
        <Route path="/login" component={Login}></Route>
        <Route path="/count" component={Counter}></Route>
      </div>
    </Router>
  )
}
export default App
